<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="__STATIC__/js/jquery.js"></script>
    <script src="__STATIC__/layui/layui.js"></script>
    <script type="text/javascript" src="__STATIC__/x-admin/js/xadmin.js"></script>
    <link rel="stylesheet" href="__STATIC__/x-admin/css/font.css">
    <link rel="stylesheet" href="__STATIC__/x-admin/css/xadmin.css">
    <link rel="stylesheet" href="__STATIC__/layui/css/layui.css">
    <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css" />
    <script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
    <style type="text/css">
        html,body{
            width: 100%;
            height: 100%;
            margin: 0px;
        }
        .map{
            height: 100%;
            width: 100%;
            float: left;
        }
    </style>
</head>
<body>
<div style="height: 20px"></div>
<div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="#">用户管理</a>
        <a href="#">学校管理</a>
        <a href="#">添加学校</a>
      </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
</div>
<form id="train" onsubmit="return false" style="width:700px;padding-top: 10px">
    <input type="hidden" name="img1" id="image1">
    <input type="hidden" name="img2" id="image2">
    <div class="layui-form-item">
        <label class="layui-form-label">名称</label>
        <div class="layui-input-block">
            <input type="text" name="name" id="name"  placeholder="名称" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">联系人</label>
        <div class="layui-input-block">
            <input type="text" name="phone_name" id="phone_name" placeholder="联系人" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">代理人</label>
        <div class="layui-input-block">
            <select name="customer_id" id="customer_id" style="height: 40px">
                {foreach $info as $val}
                    <option value="{$val.id}">{$val.name}</option>
                {/foreach}
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手机号</label>
        <div class="layui-input-block">
            <input type="text" name="phone" id="login"  placeholder="手机号" autocomplete="off" class="layui-input">
            <div class="layui-form-mid layui-word-aux" style="color: red">作为登录账号，不可修改</div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">登录密码</label>
        <div class="layui-input-block">
            <input type="password" name="password" id="password"  placeholder="密码由6-20个字母、数字、下划线组成" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">确认密码</label>
        <div class="layui-input-block">
            <input type="password" name="pass" id="pass" placeholder="请输入密码" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">官网</label>
        <div class="layui-input-block">
            <input type="text" name="url" id="url" placeholder="学校官网" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">邮箱</label>
        <div class="layui-input-block">
            <input type="text" name="email" id="email" placeholder="邮箱" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item ">
        <label class="layui-form-label" >地址</label>
        <div class="layui-input-inline" style="display: inline-block" id="city">

        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">具体地址</label>
        <div class="layui-input-block">
            <textarea name="address" id="address" placeholder="具体地址" class="layui-textarea"></textarea>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">封面图1</label>
        <div class="layui-input-inline">
            <button type="button" class="layui-btn" id="upload1">
                <i class="layui-icon">&#xe67c;</i>上传图片
            </button>
            <span id="img1"></span>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">封面图2</label>
        <div class="layui-input-inline">
            <button type="button" class="layui-btn" id="upload2">
                <i class="layui-icon">&#xe67c;</i>上传图片
            </button>
            <span id="img2"></span>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">简介</label>
        <div class="layui-input-block">
            <textarea name="content" id="content" placeholder="简介" class="layui-textarea"></textarea>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">合作时间</label>
        <div class="layui-input-block">
            <div class="layui-input-inline" style="width: 150px;">
                <input type="text" id="start" name="start"  placeholder="开始时间" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid">-</div>
            <div class="layui-input-inline" style="width: 150px;">
                <input type="text" id="end" name="end"  placeholder="结束时间" autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>
    <div id="container" class="map" style="width: 600px;height: 400px;margin-left: 100px"></div>
    <div class="input-card">
        <h4>左击获取经纬度：</h4>
        <div class="input-item">
            <input type="text" readonly="true" name="lnglat" id="lnglat">
        </div>
    </div>
    <div class="layui-form-item" style="padding-top: 10px">
        <div class="layui-input-block">
            <button class="layui-btn" id="add" >立即添加</button>
            <button onclick="back()" class="layui-btn layui-btn-primary">返回</button>
        </div>
    </div>
</form>
<script src="https://webapi.amap.com/maps?v=1.4.15&key=b4706232519c0e6f343eff8908861424&plugin=AMap.Autocomplete"></script>
<!--高得地图-->
<script type="text/javascript">
    var map = new AMap.Map("container", {
        resizeEnable: true
    });
    //为地图注册click事件获取鼠标点击出的经纬度坐标
    map.on('click', function(e) {
        document.getElementById("lnglat").value = e.lnglat.getLng() + ',' + e.lnglat.getLat()
    });
    var auto = new AMap.Autocomplete({
        input: "tipinput"
    });
    AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
    function select(e) {
        if (e.poi && e.poi.location) {
            map.setZoom(15);
            map.setCenter(e.poi.location);
        }
    }
</script>
<script>
    layui.use(['laydate','layer','form','upload'], function(){
        var laydate = layui.laydate;
        layer = layui.layer;
        laydate.render({
            elem: '#start'
        });
        laydate.render({
            elem: '#end'
        });
        var upload = layui.upload;
        upload.render({
            elem: '#upload1' //绑定元素
            ,url: "{:url('/common/upload_train_img')}" //上传接口
            ,accept:'images'
            ,size:1024
            ,done: function(res){
                if(res.code){
                    layer.msg(res.msg,{icon:1,time:2000});
                    $("#image1").val(res.src);
                    $("#img1").html(res.src);
                }else{
                    layer.msg(res.error,{icon:5,time:2000});
                }
            }
        });
        upload.render({
            elem: '#upload2' //绑定元素
            ,url: "{:url('/common/upload_train_img')}" //上传接口
            ,accept:'images'
            ,size:1024
            ,done: function(res){
                if(res.code){
                    layer.msg(res.msg,{icon:1,time:2000});
                    $("#image2").val(res.src);
                    $("#img2").html(res.src);
                }else{
                    layer.msg(res.error,{icon:5,time:2000});
                }
            }
        });
    });
    function back() {
        window.history.go(-1);
    }
</script>
<!--城市级联-->
<script>
    //默认1级
    $(function(){
        load(1);
    });
    //城市级联
    function load(id){
        $.ajax({
            url:"{:url('/school/regionFind')}",
            data:"id="+id,
            type:"get",
            dataType:"json",
            success:function(data){
                if(data == null || data.length == 0){
                    return ;
                }
                var info = "<select name='province[]' style='height: 40px'><option >-请选择-</option>";
                for(var i=0;i<data.length;i++){
                    info+='<option value=\"'+data[i].id+'\">';
                    info+=data[i].region_name;
                    info+='</option>';
                }
                info += "</select>";
                $(info).appendTo("#city").change(function(){
                    $(this).nextAll("select").remove();
                    if($(this).val() != ""){
                        load($(this).val());
                    }
                });
            }
        });
    }
</script>
<script>
    $("#add").click(function(){
        //密码正则  只能输入6-20个字母、数字、下划线
        var patrn = /^(\w){6,20}$/;
        var pwd = $("#password").val();
        var password = $("#pass").val();
        if(!patrn.test(pwd)){
            layer.msg('密码长度为6-20位字符',{icon:5,time:2000});
            return;
        }
        if(pwd != password){
            layer.msg('两次密码不一致',{icon:5,time:2000});
            return;
        }
        $.ajax({
            url:"{:url('/train/trainInsert')}",
            type:"post",
            data:$("#train").serialize(),
            dataType:"json",
            success:function(res){
                if(res.code){
                    layer.msg(res.msg,{icon:1,time:2000},function(){
                        window.location.reload();
                    });
                    return;
                }else{
                    layer.msg(res.msg,{icon:5,time:2000});
                    return;
                }
            }
        });
    });
</script>
</body>
</html>